Dropdownlist and OnMouseover Event using Ajax

[=?Utf-8?B?RGVlcGE=?=]

Hi All,

I have a webform in asp.net framework 1.1 where the dropdownlist is
populated with list of locations from the database. The depending on the list
selected, the user will be able to see functions associated for that location.

Ex: Location: Charleston
Functions: Add, Delete, Cancel, Edit

Location: Los Angeles
Functions: Activate, Cancel

The functions will be displayed in a Repeater control in the right corner of
the page.
I was able to use OnChange of this dropdownlist to show the list of
functions. But, I would like to use OnMouseover of the list of items in the
dropdownlist to show the functions. The list has to change everytime the user
does a mouseover on the location. How can I accomplish this?

Here is my code:

<asp:DropDownList id="LocationsGroups" tabIndex="16" runat="server"
cssclass="body-small" width="100%"></asp:DropDownList>

<asp:repeater id="GrpLocFunctions" runat="server">
<ItemTemplate>
<tbody>
<tr class="regular-row">
<td width="100%"><%# DataBinder.Eval(Container.DataItem, "FUNCTION") %>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr class="alternate-row">
<td width="100%"><%# DataBinder.Eval(Container.DataItem, "FUNCTION") %>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</tbody>
</table>
</FooterTemplate>
</asp:repeater>

AJAX code:

function filterFuncs() {
var gl = document.getElementById('LocationsGroups').options .value;
SunCom.UsersAgentAdmin.UserMaint.FilterGroupLocati onFunctions(gl,
filterFuncs_CallBack);

}

function filterFuncs_CallBack(res) {
if(res.error == null) {
document.getElementById('GroupLocationFunctions'). innerHTML =
res.value;
}
}

The code behind calls this

LocationsGroups.Attributes.Add("OnChange", "filterFuncs();")

I tried to change the OnChange to OnMouseOver. It didnot work.

Appreciate some help.

Thanks.

[Ben Rush]

Hi Deepa,

IE doesn't seem to support onmouseover on the option tag, which is I *think*
what you're getting at (ie, when someone mouses over an item in the opened
drop-down menu you can detect that through an event and, in your case,
update something on the page). It appears as though some browsers support
this, but IE does not (see the "Applies to" section at the bottom of this
page):

http://msdn.microsoft.com/library/de...nmouseover.asp

--
~~~~~~~~~~~
Ben Rush
http://www.ben-rush.net/blog
"Deepa" <De***@discussions.microsoft.comwrote in message
news:FF**********************************@microsof t.com...

Hi All,

I have a webform in asp.net framework 1.1 where the dropdownlist is
populated with list of locations from the database. The depending on the
list
selected, the user will be able to see functions associated for that
location.

Ex: Location: Charleston
Functions: Add, Delete, Cancel, Edit

Location: Los Angeles
Functions: Activate, Cancel

The functions will be displayed in a Repeater control in the right corner
of
the page.
I was able to use OnChange of this dropdownlist to show the list of
functions. But, I would like to use OnMouseover of the list of items in
the
dropdownlist to show the functions. The list has to change everytime the
user
does a mouseover on the location. How can I accomplish this?

Here is my code:

<asp:DropDownList id="LocationsGroups" tabIndex="16" runat="server"
cssclass="body-small" width="100%"></asp:DropDownList>

<asp:repeater id="GrpLocFunctions" runat="server">
<ItemTemplate>
<tbody>
<tr class="regular-row">
<td width="100%"><%# DataBinder.Eval(Container.DataItem, "FUNCTION") %>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr class="alternate-row">
<td width="100%"><%# DataBinder.Eval(Container.DataItem, "FUNCTION") %>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</tbody>
</table>
</FooterTemplate>
</asp:repeater>

AJAX code:

function filterFuncs() {
var gl = document.getElementById('LocationsGroups').options .value;
SunCom.UsersAgentAdmin.UserMaint.FilterGroupLocati onFunctions(gl,
filterFuncs_CallBack);

}

function filterFuncs_CallBack(res) {
if(res.error == null) {
document.getElementById('GroupLocationFunctions'). innerHTML =
res.value;
}
}

The code behind calls this

LocationsGroups.Attributes.Add("OnChange", "filterFuncs();")

I tried to change the OnChange to OnMouseOver. It didnot work.

Appreciate some help.

Thanks.

[=?Utf-8?B?RGVlcGE=?=]

Hi Ben,

Thanks for the info.

Is there any other way to accomplish this?

Deepa

"Ben Rush" wrote:

Hi Deepa,

IE doesn't seem to support onmouseover on the option tag, which is I *think*
what you're getting at (ie, when someone mouses over an item in the opened
drop-down menu you can detect that through an event and, in your case,
update something on the page). It appears as though some browsers support
this, but IE does not (see the "Applies to" section at the bottom of this
page):

http://msdn.microsoft.com/library/de...nmouseover.asp

--
~~~~~~~~~~~
Ben Rush
http://www.ben-rush.net/blog
"Deepa" <De***@discussions.microsoft.comwrote in message
news:FF**********************************@microsof t.com...

Hi All,

I have a webform in asp.net framework 1.1 where the dropdownlist is
populated with list of locations from the database. The depending on the
list
selected, the user will be able to see functions associated for that
location.

Ex: Location: Charleston
Functions: Add, Delete, Cancel, Edit

Location: Los Angeles
Functions: Activate, Cancel

The functions will be displayed in a Repeater control in the right corner
of
the page.
I was able to use OnChange of this dropdownlist to show the list of
functions. But, I would like to use OnMouseover of the list of items in
the
dropdownlist to show the functions. The list has to change everytime the
user
does a mouseover on the location. How can I accomplish this?

Here is my code:

<asp:DropDownList id="LocationsGroups" tabIndex="16" runat="server"
cssclass="body-small" width="100%"></asp:DropDownList>

<asp:repeater id="GrpLocFunctions" runat="server">
<ItemTemplate>
<tbody>
<tr class="regular-row">
<td width="100%"><%# DataBinder.Eval(Container.DataItem, "FUNCTION") %>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr class="alternate-row">
<td width="100%"><%# DataBinder.Eval(Container.DataItem, "FUNCTION") %>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</tbody>
</table>
</FooterTemplate>
</asp:repeater>

AJAX code:

function filterFuncs() {
var gl = document.getElementById('LocationsGroups').options .value;
SunCom.UsersAgentAdmin.UserMaint.FilterGroupLocati onFunctions(gl,
filterFuncs_CallBack);

}

function filterFuncs_CallBack(res) {
if(res.error == null) {
document.getElementById('GroupLocationFunctions'). innerHTML =
res.value;
}
}

The code behind calls this

LocationsGroups.Attributes.Add("OnChange", "filterFuncs();")

I tried to change the OnChange to OnMouseOver. It didnot work.

Appreciate some help.

Thanks.

[Ben Rush]

You may want to start looking at other control developers and see if someone
has implemented anything that will allow you to do this. Perhaps Telerik
(http://www.telerik.com); I've used them before and am a big fan. I'm
unaware as to whether they have anything for you.

You can maybe look to another option for displaying the locations (in lieu
of using a dropdown list). Perhaps just a scrollable DIV tag in the browser,
etc.

--
~~~~~~~~~~~
Ben Rush
http://www.ben-rush.net/blog
"Deepa" <De***@discussions.microsoft.comwrote in message
news:01**********************************@microsof t.com...

Hi Ben,

Thanks for the info.

Is there any other way to accomplish this?

Deepa

"Ben Rush" wrote:

>Hi Deepa,

IE doesn't seem to support onmouseover on the option tag, which is I
*think*
what you're getting at (ie, when someone mouses over an item in the
opened
drop-down menu you can detect that through an event and, in your case,
update something on the page). It appears as though some browsers support
this, but IE does not (see the "Applies to" section at the bottom of this
page):

http://msdn.microsoft.com/library/de...nmouseover.asp

--
~~~~~~~~~~~
Ben Rush
http://www.ben-rush.net/blog
"Deepa" <De***@discussions.microsoft.comwrote in message
news:FF**********************************@microso ft.com...

Hi All,

I have a webform in asp.net framework 1.1 where the dropdownlist is
populated with list of locations from the database. The depending on
the
list
selected, the user will be able to see functions associated for that
location.

Ex: Location: Charleston
Functions: Add, Delete, Cancel, Edit

Location: Los Angeles
Functions: Activate, Cancel

The functions will be displayed in a Repeater control in the right
corner
of
the page.
I was able to use OnChange of this dropdownlist to show the list of
functions. But, I would like to use OnMouseover of the list of items in
the
dropdownlist to show the functions. The list has to change everytime
the
user
does a mouseover on the location. How can I accomplish this?

Here is my code:

<asp:DropDownList id="LocationsGroups" tabIndex="16" runat="server"
cssclass="body-small" width="100%"></asp:DropDownList>

<asp:repeater id="GrpLocFunctions" runat="server">
<ItemTemplate>
<tbody>
<tr class="regular-row">
<td width="100%"><%# DataBinder.Eval(Container.DataItem, "FUNCTION") %>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr class="alternate-row">
<td width="100%"><%# DataBinder.Eval(Container.DataItem, "FUNCTION") %>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</tbody>
</table>
</FooterTemplate>
</asp:repeater>

AJAX code:

function filterFuncs() {
var gl = document.getElementById('LocationsGroups').options .value;
SunCom.UsersAgentAdmin.UserMaint.FilterGroupLocati onFunctions(gl,
filterFuncs_CallBack);

}

function filterFuncs_CallBack(res) {
if(res.error == null) {
document.getElementById('GroupLocationFunctions'). innerHTML =
res.value;
}
}

The code behind calls this

LocationsGroups.Attributes.Add("OnChange", "filterFuncs();")

I tried to change the OnChange to OnMouseOver. It didnot work.

Appreciate some help.

Thanks.